<template>
  <div id="app">
    <router-view></router-view>
  </div>  
</template>

<script>
  export default {
    name: 'app',
    beforeMount() {
      this.setFontSize(750);
    },
    methods: {
      setFontSize(designSize){
        let docEl = document.documentElement,
        resizeEvent = 'orientationchange' in window ? 'orientationchage' : 'resize',
        reloadFont = function(){
          const clientWidth = docEl.clientWidth;
          if (!clientWidth) {
            return
          } 
          docEl.style.fontSize = 20 * (clientWidth / designSize) + 'px';
        };
        if(!docEl.style.fontSize) {
          reloadFont()
        }
        window.addEventListener(resizeEvent,reloadFont,false);
      }
    }
  }
</script>

<style src="./assets/css/reset.css"></style>
<style src="./assets/css/layout.scss"></style>
